<template>
  <div class="content">
    <dc-header :title="'消息中心'" :action-title="'设置'" :right-page-to="'/infoSetting'"></dc-header>

    <div class="head-top mt20">
        <dc-cell v-for="inform in informList" :key="inform.msgTypeCode"
                 :to="'/risk/'+ inform.msgTypeCode + '/' + inform.msgTypeTitle"
                 :title="inform.msgTypeTitle" :label="inform.msgTypeDigest"
                 :leftIcon="inform.msgTypeIcon" :leftStyle="{color:inform.msgTypeIconStyle,fontSize:'44px'}"
                 :badgeName="inform.msgNum" isLink>
        </dc-cell>
    </div>
    <dc-footer></dc-footer>
  </div>
</template>
<script>
  import header from '@/components/header';
  import footer from '@/components/footer';
  import api from '@/common/api/inform';
  import cell from '@/components/cell';
  /**
   * @namespace  components/inform/info
   * @author ashen
   */
  export default {
    components: {
      'dc-header': header,
      'dc-footer': footer,
      'dc-cell': cell
    },
    data () {
      return {
        informList: []
      };
    },
    activated () {
      api.getInform().then(res => {
        this.informList = res;
      });
    }
  };
</script>
<style lang="scss" scoped>
  @import "../../assets/css/variable";

  .list {
    height: px2rem(140px);
  }
</style>
